Ext.onReady(function() {
   var login_status_bar=new Ext.ux.StatusBar({   
           text: '准备登录',
           width : 195,
           iconCls: 'x-status-valid'
        });
	var do_login = function() {
		if (login_form.form.isValid()) {
			var values = login_form.form.getFieldValues();
			values["manager.password"] = MD5(values["manager.password"]);
	        login_status_bar.setStatus({
                text: '登录中 ...',
                iconCls: 'x-status-busy'
            });
			Ext.Ajax.request({
				params : values,
				url : 'manager/login.action',
				success : function(resp) {
					var result = Ext.util.JSON.decode(resp.responseText);
					if (result["status"] === true) {
						setCookie('username',values["manager.name"],null);
						setCookie('purview',result["purview"],null);
						login_status_bar.setStatus({
                            text: '正在跳转 ...',
                            iconCls: 'x-status-busy'
                         });
						window.location = "index.html";
					} else {
						login_status_bar.setStatus({
                            text: result["info"],
                            iconCls: 'x-status-error'
                        });;
					}
				}
			});
		}
	};

	var login_form = new Ext.FormPanel({
		height : 200,
		border : false,
	    labelAlign : 'top',
		bodyStyle : 'background:transparent; padding:50px 750px',
		defaults : {
			bodyStyle : 'background:transparent',
			border : false
		},
		keys : [{
			key : [10, 13],
			fn : do_login
		}],
		items : [{
			xtype : 'textfield',
			fieldLabel : '用户名',
			name : 'manager.name',
			labelStyle: 'font-weight:bold;color:#897F67;',
			style : 'background: url("images/textfield.jpg")',
			width : 200,
			height : 28,
			allowBlank : false
		}, {
			xtype : 'textfield',
			fieldLabel : '密码',
			name : 'manager.password',
			labelStyle: 'font-weight:bold;color:#897F67;',
			style : 'background: url("images/textfield.jpg")',
			inputType : 'password',
			width : 200,
			height : 28,
			allowBlank : false
		}, {
			height : 8
		}, {
			xtype : 'panel',
			width : 200,
			height : 30,
			layout : 'hbox',
			items : [{
				xtype : 'button',
				text : '登录',
				width : 90,
				height : 25,
				handler : do_login
			}, {
				bodyStyle : 'background:transparent',
				width : 20,
				border : false
			}, {
				xtype : 'button',
				text : '重置',
				width : 90,
				height : 25,
				handler : function(){
					login_form.form.reset();
				}
			}]
		}]
	});

	var panel = new Ext.Panel({
		autoScroll : true,
		bodyStyle:'background: url("images/background.jpg")',
		border : false,
		layout : 'anchor',
		defaults : {
			border : false
		},
		items : [{
				anchor : '100% 25%',
				bodyStyle : 'background:transparent'
			}, {
				anchor : '100% 50%',
				bodyStyle:'background:url(images/front.jpg)',
				defaults : {
					bodyStyle : 'background:transparent',
					border : false
				},
				items : [{
					padding : 15,
					html : ''
				}, {
					items : [login_form]
				}, {
					items : [{
							height : 2,
							border : false,
							bodyStyle : 'background-color:#EFEFEF'
						}]
				},{
					defaults : {
                            bodyStyle : 'background:transparent'
                    },
					layout : 'hbox',
				    items :[{
				       border : false,
				       width : 750
				    },{
				       width : 200,
				       bbar : [login_status_bar]
				    }]
				}]
			}, {
				    anchor : "100% 25%",
				    bodyStyle : 'background-image:url(images/shadow.jpg)'
				}]
	});

	new Ext.Viewport({
		        layout : 'fit',
				items : [panel]
			});
});